<pre>
This program contains the formula to convert a 5-decpoint latlong coordinate
into an x-y coordinate to within 1m of accuracy at the equator.
lats(array),longs(array) = coordinates of positions on the map
<?php
$lats = array(-36.77293,-36.77294);
$longs = array(174.67573,174.67574);
// Lets check some bounds
$topy = max($lats); // Assume we dont cross the meridian !
$topx = max($longs);
$boty = min($lats);
$botx = min($longs);
// convert x and y into metres to give size of grid (height width)
$deglatinkm = 40030/360 ;
$deglonginkm = cos(deg2rad($boty))*40030/360 ;
$h = ($topy-$boty)*$deglatinkm ;
echo("Height in km ".($h*1000)."\n");
$w = $deglonginkm*($topx-$botx);
echo ("Width in km ".($w*1000)."\n");
// Okay lets plot x and y within that window assuming the convex surface is flat
// Start by working out a scale to the screen
$screenwidth = 1200;
$screenheight = 400;
$mgn = 20;
$scale = min(($screenwidth-$mgn*2)/$w,($screenheight-$mgn*2)/$h);
echo ("Scale is 1 pixel to $scale km \n");

$o  = "<canvas id=canv width=$screenwidth height=$screenheight style='border:1px solid black;'></canvas>\n";
$o .= "<script>\n";
$o .= "var c = document.getElementById('canv');\n";
$o .= "var ctx = c.getContext('2d');\n";
for($i=0;$i<sizeof($lats);$i++) {
 $lat = $lats[$i];
 $long = $longs[$i];
 $xpos = floor(($long-$botx)*$scale*$deglonginkm+$mgn);
 $ypos = floor($screenheight-($lat-$boty)*$scale*$deglatinkm-$mgn);
 $o .= "ctx.beginPath();\n";
 $o .= "ctx.arc($xpos,$ypos,10,0,2*Math.PI);\n";
 $o .= "ctx.stroke();\n";
 echo "Xpos is $xpos and Ypos is $ypos\n";
}
$o .= "</script>";

echo $o;
?>